<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>改变div的大小、颜色</title>
	<style type="text/css">
        #div1{
        	width:200px;height:200px;background:red;
        }
	</style>
</head>
<body>
    
    <script type="text/javascript">
        function toGreen(){
        	var oDiv =  document.getElementById('div1');

        	oDiv.style.width='300px';
        	oDiv.style.height = '300px';
        	oDiv.style.background = 'green';
        }

	    function toRed(){
	        var oDiv =  document.getElementById('div1');

	        oDiv.style.width='200px';
	        oDiv.style.height = '200px';
	        oDiv.style.background = 'red';
        }
    </script>


	<div id="div1"  onmouseover="toGreen()" onmouseout="toRed()">

	
	</div>
		
	
</body>
</html>